﻿<Page
    x:Class="Ganjine.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Ganjine"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    DataContext="{Binding DefaultViewModel, RelativeSource={RelativeSource Self}}"
    FlowDirection="RightToLeft" RequestedTheme="Light" Loaded="Page_Loaded"
    GotFocus="pageRoot_GotFocus" LostFocus="pageRoot_LostFocus" SizeChanged="Page_SizeChanged">
    <Page.Transitions>
        <TransitionCollection>
            <NavigationThemeTransition>
                <NavigationThemeTransition.DefaultNavigationTransitionInfo>
                    <DrillInNavigationTransitionInfo />
                </NavigationThemeTransition.DefaultNavigationTransitionInfo>
            </NavigationThemeTransition>
        </TransitionCollection>
    </Page.Transitions>

    <Page.BottomAppBar>
        <CommandBar x:Name="PhoneCommandBar" >
            <!----> <AppBarToggleButton x:Name="AppBarButtonSort" Icon="Sort" Label="تغییر چینش" Click="SortAppBarButton_Click"/>
            <AppBarButton x:Name="AppBarButtonSettings" Icon="Setting" Label="تنظیمات"/>
            <CommandBar.SecondaryCommands>
                <AppBarButton x:Name="AppBarButtonAbout" Label="درباره"/>
            </CommandBar.SecondaryCommands>
        </CommandBar>
    </Page.BottomAppBar>


    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.Resources>
            <Storyboard x:Name="PoetsListViewAnim">
                <DoubleAnimation Storyboard.TargetName="PoetsListView"
                                 Storyboard.TargetProperty="Opacity"
                                 To="0.8"
                                 Duration="0:0:0.3"
                                 AutoReverse="False">
                </DoubleAnimation>
            </Storyboard>
            <Storyboard x:Name="PoetsListViewAnimReverse">
                <DoubleAnimation Storyboard.TargetName="PoetsListView"
                                 Storyboard.TargetProperty="Opacity"
                                 To="1"
                                 Duration="0:0:0.3"
                                 AutoReverse="False">
                </DoubleAnimation>
            </Storyboard>
        </Grid.Resources>
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState x:Name="ultraWideView">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="1350" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="GridOfFavorites.Width" Value="550"/>
                        <Setter Target="GridOfPoets.Margin" Value="0,0,550,0"/>

                        <Setter Target="MainContent.Visibility" Value="Visible"/>
                        <Setter Target="PhoneMainContent.Visibility" Value="Collapsed"/>
                        <Setter Target="PhoneCommandBar.Visibility" Value="Collapsed"/>

                        <Setter Target="SearchToggle.Visibility" Value="Collapsed"/>
                        <Setter Target="SearchBar.HorizontalAlignment" Value="Right"/>
                        <Setter Target="SearchBar.Width" Value="350"/>
                        <Setter Target="SearchBar.Visibility" Value="Visible"/>
                        <Setter Target="HeaderRowDefinition.Height" Value="70"/>
                        <Setter Target="HeaderRelPanel1.Margin" Value="10,15,0,0"/>
                        <Setter Target="SearchBar.Margin" Value="60,10,0,10"/>
                        <Setter Target="headerText.Visibility" Value="Visible"/>
                        <Setter Target="BackToggle.Visibility" Value="Collapsed"/>
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="wideView">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="1050" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="GridOfFavorites.Width" Value="400"/>
                        <Setter Target="GridOfPoets.Margin" Value="0,0,400,0"/>


                        <Setter Target="MainContent.Visibility" Value="Visible"/>
                        <Setter Target="PhoneMainContent.Visibility" Value="Collapsed"/>
                        <Setter Target="PhoneCommandBar.Visibility" Value="Collapsed"/>

                        <Setter Target="SearchToggle.Visibility" Value="Collapsed"/>
                        <Setter Target="SearchBar.HorizontalAlignment" Value="Right"/>
                        <Setter Target="SearchBar.Width" Value="350"/>
                        <Setter Target="SearchBar.Visibility" Value="Visible"/>
                        <Setter Target="HeaderRowDefinition.Height" Value="70"/>
                        <Setter Target="HeaderRelPanel1.Margin" Value="10,15,0,0"/>
                        <Setter Target="SearchBar.Margin" Value="60,10,0,10"/>
                        <Setter Target="headerText.Visibility" Value="Visible"/>
                        <Setter Target="BackToggle.Visibility" Value="Collapsed"/>
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="mediumView">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="908" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="GridOfFavorites.Width" Value="350"/>
                        <Setter Target="GridOfPoets.Margin" Value="0,0,350,0"/>


                        <Setter Target="MainContent.Visibility" Value="Visible"/>
                        <Setter Target="PhoneMainContent.Visibility" Value="Collapsed"/>
                        <Setter Target="PhoneCommandBar.Visibility" Value="Collapsed"/>

                        <Setter Target="SearchToggle.Visibility" Value="Collapsed"/>
                        <Setter Target="SearchBar.HorizontalAlignment" Value="Right"/>
                        <Setter Target="SearchBar.Width" Value="350"/>
                        <Setter Target="SearchBar.Visibility" Value="Visible"/>
                        <Setter Target="HeaderRowDefinition.Height" Value="70"/>
                        <Setter Target="HeaderRelPanel1.Margin" Value="10,15,0,0"/>
                        <Setter Target="SearchBar.Margin" Value="60,10,0,10"/>
                        <Setter Target="headerText.Visibility" Value="Visible"/>
                        <Setter Target="BackToggle.Visibility" Value="Collapsed"/>
                    </VisualState.Setters>
                </VisualState>
                <VisualState x:Name="smallView">
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="700" />
                    </VisualState.StateTriggers>
                    <VisualState.Setters>
                        <Setter Target="MainContent.Visibility" Value="Collapsed"/>
                        <Setter Target="PhoneMainContent.Visibility" Value="Visible"/>
                        <Setter Target="PhoneCommandBar.Visibility" Value="Visible"/>

                        <Setter Target="SearchToggle.Visibility" Value="Collapsed"/>
                        <Setter Target="SearchBar.HorizontalAlignment" Value="Right"/>
                        <Setter Target="SearchBar.Width" Value="350"/>
                        <Setter Target="SearchBar.Visibility" Value="Visible"/>
                        <Setter Target="HeaderRowDefinition.Height" Value="70"/>
                        <Setter Target="HeaderRelPanel1.Margin" Value="10,15,0,0"/>
                        <Setter Target="SearchBar.Margin" Value="60,10,0,10"/>
                        <Setter Target="headerText.Visibility" Value="Visible"/>
                        <Setter Target="BackToggle.Visibility" Value="Collapsed"/>
                    </VisualState.Setters>
                </VisualState>

                <VisualState x:Name="narrowView">
                    <VisualState.Setters>
                        <Setter Target="MainContent.Visibility" Value="Collapsed"/>
                        <Setter Target="PhoneMainContent.Visibility" Value="Visible"/>
                        <Setter Target="PhoneCommandBar.Visibility" Value="Visible"/>

                        <Setter Target="SearchToggle.Visibility" Value="Visible"/>
                        <Setter Target="SearchBar.HorizontalAlignment" Value="Stretch"/>
                        <Setter Target="SearchBar.Width" Value="Auto"/>
                        <Setter Target="SearchBar.Visibility" Value="Collapsed"/>
                        <Setter Target="HeaderRowDefinition.Height" Value="50"/>
                        <Setter Target="HeaderRelPanel1.Margin" Value="0,5,0,0"/>
                        <Setter Target="SearchBar.Margin" Value="60,0,0,0"/>

                        <Setter Target="headerText.Visibility" Value="Visible"/>
                        <Setter Target="BackToggle.Visibility" Value="Collapsed"/>
                    </VisualState.Setters>
                    <VisualState.StateTriggers>
                        <AdaptiveTrigger MinWindowWidth="0" />
                    </VisualState.StateTriggers>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>


        <Grid.RowDefinitions>
            <RowDefinition Height="70" x:Name="HeaderRowDefinition" />
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0" x:Name="Header" Background="{StaticResource HeaderColor}">
            <RelativePanel Margin="10,15,0,0" x:Name="HeaderRelPanel1" >
                <Button x:Name="SearchToggle"   
                      Background="Transparent" Click="SearchToggle_Click">
                    <FontIcon x:Name="SearchToggleIcon"  
                              FontFamily="Segoe MDL2 Assets"  
                         Foreground="{ThemeResource AppBarItemForegroundThemeBrush}"  
                         Glyph="&#xE094;" FontSize="30" />
                </Button>
                <Button x:Name="BackToggle" Visibility="Collapsed" 
                      Background="Transparent" Click="BackToggle_Click">
                    <FontIcon x:Name="BackToggleIcon"  
                              FontFamily="Segoe MDL2 Assets"  
                         Foreground="{ThemeResource AppBarItemForegroundThemeBrush}"  
                         Glyph="&#xE0AD;" FontSize="30" />
                </Button>
                <TextBlock x:Name="headerText" FontFamily="/Fonts/Yekan.otf#B Yekan" HorizontalAlignment="Left" TextWrapping="Wrap" Text="گنجینه" RelativePanel.RightOf="SearchToggle" FontSize="30" VerticalAlignment="Bottom" Margin="10,0,0,0"/>
            </RelativePanel>
            <Grid HorizontalAlignment="Right" Width="400" x:Name="SearchBar" Margin="60,10,0,10">
                <TextBox Margin="5,5,55,5" FlowDirection="RightToLeft" x:Name="SearchTextBox" KeyUp="SearchTextBox_KeyUp" TextChanged="SearchTextBox_TextChanged" LostFocus="SearchTextBox_LostFocus" />
                <Button x:Name="SearchButton"   Margin="5,5,5,5" HorizontalAlignment="Right"
                      Background="Transparent" Click="SearchButton_Click">
                    <FontIcon x:Name="SearchButtonIcon"  
                              FontFamily="Segoe MDL2 Assets"  
                         Foreground="{ThemeResource AppBarItemForegroundThemeBrush}"  
                         Glyph="&#xE094;" FontSize="28" />
                </Button>
            </Grid>
        </Grid>
        <Grid Grid.Row="1">
            <ProgressRing x:Name="LoadingRing" HorizontalAlignment="Center" VerticalAlignment="Center" Width="50" Height="50" IsActive="True"/>
            <Grid x:Name="MainContent">
                <Grid HorizontalAlignment="Right" Background="{StaticResource SideBarColor}" Width="500" x:Name="GridOfFavorites">
                    <Grid Padding="30">
                        <TextBlock FontSize="25">علاقه‌مندی‌ها</TextBlock>
                        <TextBlock TextWrapping="Wrap" Foreground="#FF555555" FontSize="20" VerticalAlignment="Top" Margin="0,70,0,0" Text="در حال حاضر فهرست علاقه‌مندی‌های شما خالی است. برای افزودن شعرهای مورد علاقه‌ی خود به این فهرست، در هنگام خواندن شعر، علامت ستاره را از نوار پایین فشار دهید." Visibility="Visible" />
                    </Grid>
                    <StackPanel VerticalAlignment="Bottom" Background="{StaticResource SideBarColorDark}" HorizontalAlignment="Stretch" Orientation="Horizontal" >
                        <!--<AppBarToggleButton x:Name="SideAppBarOrder" Label="تغییر چینش" VerticalAlignment="Stretch">
                            <AppBarToggleButton.Icon>
                                <FontIcon Glyph="&#xE74C;"/>
                            </AppBarToggleButton.Icon>
                        </AppBarToggleButton>-->
            <AppBarButton x:Name="SideAppBarSettings" Label="تنظیمات" VerticalAlignment="Stretch">
                <AppBarButton.Icon>
                    <FontIcon Glyph="&#xE115;"/>
                </AppBarButton.Icon>
            </AppBarButton>
            <!--<Button x:Name="ReorderButton"   Margin="5,5,5,5" HorizontalAlignment="Right" Background="Transparent" >
                            <FontIcon
                              FontFamily="Segoe MDL2 Assets" Foreground="{ThemeResource AppBarItemForegroundThemeBrush}"  
                              Glyph="&#xE74C;" FontSize="24" />
                        </Button>
                        <Button x:Name="SettingsButton"   Margin="5,5,5,5" HorizontalAlignment="Right" Background="Transparent">
                            <FontIconک
                              FontFamily="Segoe MDL2 Assets" Foreground="{ThemeResource AppBarItemForegroundThemeBrush}"  
                              Glyph="&#xE115;" FontSize="24" />
                        </Button>-->
            </StackPanel>
            </Grid>
            <Grid x:Name="GridOfPoets" Margin="0,0,500,0">
                <GridView
                            x:Name="PoetsGridView"
                            TabIndex="1"
                            Margin="0,0,0,0"
                            Padding="25,25,25,25"
                            ItemsSource="{Binding Poets}"
                            SelectionMode="None"
                            IsSwipeEnabled="false" ItemClick="itemGridView_ItemClick" IsItemClickEnabled ="True"
                            HorizontalContentAlignment="Center"
                            CanReorderItems="True"
                            CanDragItems="True"
                            AllowDrop="True">
                    <GridView.ItemTemplate>
                        <DataTemplate>
                            <Grid HorizontalAlignment="Left" Width="150" Height="210" Margin="7">
                                <Ellipse Width="150" Height="150" VerticalAlignment="Top" Fill="{Binding BackColor}" />
                                <Ellipse Width="150" Height="150" VerticalAlignment="Top">
                                    <Ellipse.Fill>
                                        <ImageBrush ImageSource="{Binding ImagePath}"/>
                                    </Ellipse.Fill>
                                </Ellipse>


                                <TextBlock Text="{Binding PoetName}" Foreground="{ThemeResource TextBoxButtonForegroundThemeBrush}" Style="{StaticResource BaseTextBlockStyle}" Margin="15,160,15,0" FontSize="17" TextWrapping="Wrap" TextAlignment="Center" HorizontalAlignment="Stretch" VerticalAlignment="Top"/>

                            </Grid>
                        </DataTemplate>
                    </GridView.ItemTemplate>
                </GridView>
            </Grid>
            </Grid>
            <Grid x:Name="PhoneMainContent">
                <Pivot IsEnabled="False" x:Name="PhoneMainContentPivot">
                    <PivotItem Header="فهرست شاعران">
                        <Grid>
                            <ListView AutomationProperties.AutomationId="ItemListViewSection5"
                                      AutomationProperties.Name="Items In Group"
                                      SelectionMode="None"
                                      IsItemClickEnabled="True"
                                      ItemsSource="{Binding Poets}"
                                      ItemClick="itemGridView_ItemClick"
                                      VirtualizingStackPanel.VirtualizationMode="Standard"
                                      ContinuumNavigationTransitionInfo.ExitElementContainer="True"
                                      x:Name="PoetsListView"
                                      CanReorderItems="False"
                                      CanDragItems="False"
                                      AllowDrop="False">
                                <ListView.RenderTransform>
                                    <ScaleTransform x:Name="PoetsListViewScaleTransform" ></ScaleTransform>
                                </ListView.RenderTransform>
                                <ListView.ItemTemplate>
                                    <DataTemplate>
                                        <Grid Height="80">

                                            <Ellipse Width="70" Height="70" VerticalAlignment="Center" HorizontalAlignment="Left" Fill="{Binding BackColor}" />
                                            <Ellipse Width="70" Height="70" VerticalAlignment="Center" HorizontalAlignment="Left">
                                                <Ellipse.Fill>
                                                    <ImageBrush ImageSource="{Binding ImagePath}" AutomationProperties.Name="{Binding Title}" Opacity="0.9" />
                                                </Ellipse.Fill>
                                            </Ellipse>

                                            <StackPanel VerticalAlignment="Center" Margin="70,0,0,0">
                                                <TextBlock Text="{Binding PoetName}" Foreground="{ThemeResource TextBoxButtonForegroundThemeBrush}" Style="{StaticResource BaseTextBlockStyle}" Height="35" Margin="15,5,15,0" FontSize="26" TextWrapping="NoWrap" HorizontalAlignment="Center"/>
                                            </StackPanel>
                                        </Grid>
                                    </DataTemplate>
                                </ListView.ItemTemplate>
                            </ListView>
                        </Grid>
                    </PivotItem>
                    <PivotItem Header="علاقه‌مندی‌ها">
                        <Grid>
                            <SemanticZoom ScrollViewer.ZoomMode="Enabled">
                                <SemanticZoom.ZoomedInView>
                                    <ListView></ListView>
                                </SemanticZoom.ZoomedInView>
                                <SemanticZoom.ZoomedOutView>
                                    <ListView
                                        x:Name="favItemListView"
                                        AutomationProperties.AutomationId="ItemListView"
                                        AutomationProperties.Name="Items In Group"
                                        TabIndex="1"
                                        Grid.Row="1"
                                        ItemsSource="{Binding Favorites}"
                                        IsItemClickEnabled="True"
                                        ItemClick="FavItemView_ItemClick"
                                        SelectionMode="None"
                                        IsSwipeEnabled="false"
                                        Margin="0,0,0,0">
                                        <ListView.ItemTemplate>
                                            <DataTemplate>
                                                <Grid>
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="Auto"/>
                                                        <ColumnDefinition Width="*"/>
                                                    </Grid.ColumnDefinitions>


                                                    <StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="14.5,0,0,0">
                                                        <TextBlock Text="{Binding Text}" Style="{StaticResource TitleTextBlockStyle}" />
                                                        <TextBlock Text="{Binding s1}" Style="{StaticResource SubtitleTextBlockStyle}" />
                                                        <TextBlock Text="{Binding s2}" Visibility="{Binding HasAdditionalData}" Style="{StaticResource SubtitleTextBlockStyle}" TextAlignment="Right" Margin="0,0,10,0" />
                                                    </StackPanel>
                                                </Grid>
                                            </DataTemplate>
                                        </ListView.ItemTemplate>
                                        <ListView.ItemContainerStyle>
                                            <Style TargetType="ListViewItem">
                                                <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                                            </Style>
                                        </ListView.ItemContainerStyle>

                                    </ListView>
                                </SemanticZoom.ZoomedOutView>
                            </SemanticZoom>
                            <TextBlock TextWrapping="Wrap" Foreground="#FF555555" FontSize="20" VerticalAlignment="Top" Margin="15" Text="در حال حاضر فهرست علاقه‌مندی‌های شما خالی است. برای افزودن شعرهای مورد علاقه‌ی خود به این فهرست، در هنگام خواندن شعر، علامت ستاره را از نوار پایین فشار دهید." Visibility="Visible" />
                        </Grid>
                    </PivotItem>
                </Pivot>
            </Grid>
            </Grid>

            </Grid>


</Page>
